<template>
	<view class="detail-wrap">
		<DetailHeader title="民意处理详情"></DetailHeader>
		<view class="header">
			关于乡村道路硬底改造问题
		</view>
		<view class="warp">
			<view class="item" :class="{item_2:item.line==2}" v-for="(item,index) in list" :key="index">
				<view class="label">
					{{item.label}}
				</view>
				<view class="content" :class="{content_2:item.line==2}">
					{{item.content}}
				</view>

			</view>
		</view>
	</view>
</template>

<script>
	import DetailHeader from '@/components/nacigation/DetailHeader.vue';
	export default {
		components: {
			DetailHeader,
		},
		data() {
			return {
				list: [{
						label: '编号',
						content: '323203020302302030203'
					},
					{
						label: '群众反映主题',
						content: '关于乡村道路硬底改造问题',
						line: 2
					},
					{
						label: '代表意见',
						content: '张三：请有关部门实地考察处理；王五：交给环保局处理',
						line: 2
					},
					{
						label: '联络站意见',
						content: '交给环保局处理',
						line: 2
					},
					{
						label: '状态',
						content: '已交由相关部门处理',
						line: 1
					},
					{
						label: '反映时间',
						content: '2024-11-21 05:37:37',
						line: 1
					}
				]
			}
		},
		methods: {
			iconClick() {},
			change() {}
		}
	};
</script>

<style scoped lang="scss">
	.detail-wrap {
		.header {
			padding: 32rpx 42rpx;
			border-bottom: 2rpx solid #F5F7F9;
			font-family: PingFang SC, PingFang SC;
			font-weight: 500;
			font-size: 32rpx;
			color: #030303;
			line-height: 38rpx;
			text-align: left;
			font-style: normal;
			text-transform: none;
		}

		.warp {
			padding: 32rpx 42rpx;

			.item {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				border-top: 1rpx solid #F5F7F9;
				border-bottom: 1rpx solid #F5F7F9;
				padding: 32rpx 0;
				font-size: 28rpx;
				color: #999999;
			}

			.item_2 {
				flex-direction: column;
			}

			.label {
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
			}

			.content {
				font-family: PingFang SC, PingFang SC;
				font-weight: 500;
				font-size: 28rpx;
				color: #484848;
			}
			.content_2{
				margin-top: 36rpx;
			}
		}


	}
</style>